import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import reportWebVitals from './reportWebVitals';
import 'antd/dist/antd.css';
import NewsList from './components/NewsList';
import LinkButton from "./components/LinkButton";
import
{
    BrowserRouter as Router,
    Switch,
    Route,
} from "react-router-dom";
import Hook from './components/Hook';
import ExpressForm from './components/ExpressForm';


ReactDOM.render(
    <React.StrictMode>
        {/* 必须放在这个router下否则获取不到上下文 */}
        <Router>
            <LinkButton to="/NewsList/12?name='leo'" />
            <LinkButton to="/" />
            <LinkButton to="/Hook/giaopi?id=123" />
            <LinkButton to="/Express/giaopi/12?id=123?age=12" />
            <Switch>
                <Route path="/NewsList/:age" children={<NewsList />} />
                <Route path="/Hook/:name" children={<Hook />} />
                <Route path="/Express/:myname/:myage" children={<ExpressForm />} />
            </Switch>
        </Router>
    </React.StrictMode>,
    document.getElementById('root')
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
